<template>
	<div>
		<sh-card title="左右分割">
			<sh-split style="height: 200px">
				<template #left>left</template>
				<template #right>right</template>
			</sh-split>
		</sh-card>
		<sh-card title="上下分割">
			<sh-split mode="vertical" style="height: 200px">
				<template #top>top</template>
				<template #bottom>bottom</template>
			</sh-split>
		</sh-card>
		<sh-card title="合并使用">
			<sh-split style="height: 200px">
				<template #left>left</template>
				<template #right>
					<sh-split mode="vertical">
						<template #top>top</template>
						<template #bottom>bottom</template>
					</sh-split>
				</template>
			</sh-split>
		</sh-card>
	</div>
</template>

<script>
export default {
	name: 'BaseSplit',
	data() {
		return {}
	}
}
</script>

<style scoped lang="scss"></style>
